﻿<CodeSnippetTabbed DocLink="https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxDataGrid-1#toolbar">
    <CodeSnippetTabPage Text="Razor">@(@"<DxDataGrid @ref=""grid""
            Data=""@Data""
            ShowFilterRow=""@ShowFilterRow""
            @bind-SingleSelectedDataRow=""@SelectedRow""
            RowInsertingAsync=""@OnRowInserting""
            RowUpdatingAsync=""@OnRowUpdating""
            InitNewRow=""@OnInitNewRow""
            CssClass=""mw-1100"">
    <HeaderTemplate>
        <DxToolbar ItemRenderStyleMode=""ToolbarRenderStyleMode.Plain"">
            <DxToolbarItem Text=""New"" BeginGroup=""true"" Click=""@OnAddNewClick"" IconCssClass=""grid-toolbar-new"" />
            <DxToolbarItem Text=""Edit"" Click=""@OnEditClick"" IconCssClass=""grid-toolbar-edit"" Enabled=""@Enabled"" />
            <DxToolbarItem Text=""Delete"" Click=""@OnDeleteClick"" IconCssClass=""grid-toolbar-delete"" Enabled=""@Enabled"" />
            <DxToolbarItem Text=""Show Filter Row"" BeginGroup=""true"" GroupName=""FilterRow"" Click=""@OnShowFilterRow"" IconCssClass=""grid-toolbar-filter-row"" />
            <DxToolbarItem Text=""Documentation"" NavigateUrl=""https://docs.devexpress.com/Blazor/401086/data-grid"" BeginGroup=""true""
                           Alignment=""ToolbarItemAlignment.Right"" IconCssClass=""grid-toolbar-document"" target=""_blank"" />
        </DxToolbar>
    </HeaderTemplate>
    <Columns>
        <DxDataGridColumn Field=""@nameof(Order.Product)"" Width=""30%"" />
        <DxDataGridDateEditColumn Field=""@nameof(Order.OrderDate)"" DisplayFormat=""D"" EditorFormat=""D"" Width=""27%"" />
        <DxDataGridSpinEditColumn Field=""@nameof(Order.UnitPrice)"" Width=""13%"" />
        <DxDataGridSpinEditColumn Field=""@nameof(Order.UnitsInOrder)"" Width=""16%"" />
        <DxDataGridComboBoxColumn Field=""@nameof(Order.OrderStatus)"" Data=""@DataStatus"" Width=""14%"" />
    </Columns>
</DxDataGrid>

@code {
    IEnumerable<Order> Data;
    IEnumerable<OrderStatus?> DataStatus;
    Order SelectedRow;
    DxDataGrid<Order> grid;
    bool Enabled = true;
    bool ShowFilterRow = false;
    OrderRepository repository = new OrderRepository();

    protected override async Task OnInitializedAsync() {
        Data = await repository.GetData();
        DataStatus = new List<OrderStatus?> { OrderStatus.Processing, OrderStatus.InTransit, OrderStatus.Delivered };
        SetSelection();
    }
    async Task OnAddNewClick() {
        await grid.StartRowEdit(null);
        if(!Enabled)
            ChangeToolbarEnabled(true);
    }
    async Task OnEditClick() {
        await grid.StartRowEdit(SelectedRow);
    }
    async Task OnDeleteClick() {
        repository.Remove(SelectedRow);
        await grid.Refresh();
        if(Data.Count() == 0)
            ChangeToolbarEnabled(false);
        else
            SetSelection();
    }
    async Task OnRowInserting(IDictionary<string, object> newValue) {
        repository.Add(newValue);
        await Task.CompletedTask;
    }
    async Task OnRowUpdating(Order dataItem, IDictionary<string, object> newValue) {
        repository.Update(dataItem, newValue);
        await Task.CompletedTask;
    }
    Task OnInitNewRow(Dictionary<string, object> values) {
        values.Add(""OrderDate"", DateTime.Now);
        return Task.CompletedTask;
    }
    void SetSelection() {
        SelectedRow = Data.First();
    }
    void ChangeToolbarEnabled(bool enabled) {
        Enabled = enabled;
        StateHasChanged();
    }
    void OnShowFilterRow(ToolbarItemClickEventArgs e) {
        ShowFilterRow = !ShowFilterRow;
    }
}")</CodeSnippetTabPage>
</CodeSnippetTabbed>
